An adjustable range Line chart

An adjustable range chart.

This goes in the documents header:

<script src="RGraph.common.core.js"></script>
<script src="RGraph.common.dynamic.js"></script>
<script src="RGraph.line.js"></script>

Put this where you want the chart to show up:

<canvas id="cvs" width="600" height="250">
    [No canvas support]
</canvas>

This is the code that generates the chart:

<script>
    window.onload = function ()
    {
        var l1 = new RGraph.Line({
            id: 'cvs',
            data: [
                [8,8,6,6,8,9,13,15,16,15,15,12,11,11,13,10,12,11,10,13,12,9,8,11,12,10,16,15,12,11],
                [4,5,3,2,5,6,8,9,5,6,4,5,3,2,5,6,8,9,5,6,4,5,3,2,5,6,8,9,5,6]
            ],
            options: {
                gutterTop: 50,
                labels: ['13th','14th','15th','16th','15th','16th','17th','18th','19th'],
                title: 'Range of fuel consumption',
                filled: true,
                filledRange: true,
                fillstyle: 'rgba(128,255,128,0.5)',
                linewidth: 2,
                colors: ['green'],
                numxticks: 8,
                adjustable: true,
                tickmarks: null,
                ymax: 25,
                textSize: 14,
                textAccessible: true
            }
        }).draw();
    };
</script>